<template>
  <div>
    <el-card>
      <template #header>
        <h3>个人中心</h3>
      </template>
      <el-descriptions :column="1" border>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">账号</div>
          </template>
          {{ loginInfo.account }}
        </el-descriptions-item>
        <el-descriptions-item >
          <template #label>
            <div class="cell-item">电话</div>
          </template>
          {{ loginInfo.telephone }}
        </el-descriptions-item>
        <el-descriptions-item v-if="loginInfo.nickname">
          <template #label>
            <div class="cell-item">昵称</div>
          </template>
         {{ loginInfo.nickname }}
        </el-descriptions-item>
        <el-descriptions-item v-if="loginInfo.role">
          <template #label>
            <div class="cell-item">角色</div>
          </template>
         {{ loginInfo.role }}
        </el-descriptions-item>
        <el-descriptions-item v-if="loginInfo.isDel >= 0">
          <template #label>
            <div class="cell-item">账号状态</div>
          </template>
         <el-tag v-if="loginInfo.isDel == 0">可用</el-tag>
         <el-tag v-else-if="loginInfo.isDel == 1">禁用</el-tag>
         <el-tag v-else-if="loginInfo.isDel == 2">离职</el-tag>
        </el-descriptions-item>
         <el-descriptions-item v-if="loginInfo.regTime">
          <template #label>
            <div class="cell-item">注册时间</div>
          </template>
          {{ dateFormat() }}
        </el-descriptions-item>
        <el-descriptions-item v-if="loginInfo.contact">
          <template #label>
            <div class="cell-item">联系人</div>
          </template>
          {{ loginInfo.contact }}
        </el-descriptions-item>
      </el-descriptions>
    </el-card>
  </div>
</template>

<script>
import dayjs from 'dayjs';
export default {
    data() { 
        return {
            loginInfo: {}
        }
    },
    methods: {
        dateFormat() {
            return dayjs(this.loginInfo.regTime).format("YYYY-MM-DD HH:mm:ss")
        }
    },
    created() { 
        this.loginInfo = JSON.parse(sessionStorage.getItem("businessInfo"))
    }
};
</script>

<style scoped>
.el-card{
    width: 500px;
}
</style>
